<template>
  <view class="container">
    <div class="navbar">
      <navbar/>
    </div>
    <div class="content">
      <grid/>
    </div>
    <div class="tabbar">
      <tabbar/>
    </div>
  </view>
</template>

<script setup>
import navbar from "@/components/index/navbar";
import tabbar from "@/components/index/tabbar";
import grid from "@/components/index/content/grid.vue";


</script>

<style>
.navbar {
  position: relative;
  width: 100%;
  z-index: 1; /* Make sure the navbar stays on top */
}

.content {
  margin-top: 60px; /* Adjust this value based on actual navbar height */
  margin-bottom: 160px;
}

.tabbar {
  position: fixed;
  bottom: 0;
  width: 100%;
}
</style>